import React, { PureComponent } from 'react'
import { connect } from 'react-redux'
import { changeBanners } from '../store/actionCreators'
import axios from 'axios'

export class Catagory extends PureComponent {
  componentDidMount(){
    // 发起网络请求
    axios.get('http://123.207.32.32:8000/home/multidata').then(res => {
      console.log(res.data.data.banner.list)
      console.log(this.props.fetchBannerList(res.data.data.banner.list))
    })
  }
  render() {
    const { banners } = this.props
    return (
      <div>
        <span>banner:数据</span>
        {
          banners.map((item,index) => {
            return <li key={index}>{item.title}</li>
          })
        }
      </div>
    )
  }
}
const mapStateToProps = (state) => ({
  counter: state.counter,
  banners: state.banners
})
const mapDispatchToProps = (dispatch) => ({
  fetchBannerList: (banners) => dispatch(changeBanners(banners))
})
export default connect(mapStateToProps,mapDispatchToProps)(Catagory)